<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./首页.css">
    <link rel="stylesheet" href="./swiper.min.css">

</head>
<body>
    <header>
        <h1> 智慧商城 </h1>
    </header>
    <main>
        <div class="search">
            <input type="text" placeholder="搜索你要找的商品">
        </div>
        <div class="center">
            <div class="banner">
                <div class="swiper-container">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide"><img src="./10004.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="./10005.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="./10006.jpg" alt=""></div>
                    </div>
                </div>    
            </div>
        </div>
        <div class="notice">
            <span>智慧商城2.0全新上线，更多新品等你来选~</span>
        </div>
        <div class="nav">
            <a href="#">
                <img src="./58a7c1f62df4cb1eb47fe83ff0e566e6.png" alt="">
                <p>新品首发</p>
            </a>
            <a href="#">
                <img src="./49c64dbbf449e9e8abfca314f92814bd.png" alt="">
                <p>居家生活</p>
            </a>
            <a href="#">
                <img src="./8573fbc5e87e8a88827e905fca284604.png" alt="">
                <p>服饰鞋包</p>
            </a>
            <a href="#">
                <img src="./f01c5fc360f55c6053beec34913bc699.png" alt="">
                <p>美食酒水</p>
            </a>
            <a href="#">
                <img src="./b106e9bd9e0c8c779e7d77a84e92ed93.png" alt="">
                <p>个护清洁</p>
            </a>
            <a href="#">
                <img src="./fd3a573889671b924d89859f521c30c9.png" alt="">
                <p>母婴亲子</p>
            </a>
            <a href="#">
                <img src="./8f979924a4fd3b5f406b62a6b405ea32.png" alt="">
                <p>运动旅行</p>
            </a>
            <a href="#">
                <img src="./f7657720f79ea9f769c40608f369130e.png" alt="">
                <p>数码家电</p>
            </a>
            <a href="#">
                <img src="./36f09e32efc53e1e695210ca92c54ed8.png" alt="">
                <p>宠物生活</p>
            </a>
            <a href="#">
                <img src="./0cccdb31952fbf3bc0026efbe260e40e.png" alt="">
                <p>每日抄底</p>
            </a>
           
        </div>
        <div class="imageSingle">
        </div>
        <div class="richText">
            <!-- <p>—— 猜你喜欢 ——</p> -->
            <span>—— 猜你喜欢 ——</span>
        </div>
        <div class="goods">
            <div class="goods-item"></div>
        </div>
    </main>
    <footer>
        <div class="item">
            <span><img src="./10001.png" alt=""></span>
            <p class="active"> 首页 </p>
        </div>
        <div class="item">
            <span><img src="./10002.png" alt=""></span>
            <p> 分类 </p>
        </div>
        <div class="item">
            <span><img src="./10003.png" alt=""></span>
            <p> 购物车 </p>
        </div>
        <div class="item">
            <span><img src="./10007.png" alt=""></span>
            <p> 我的 </p>
        </div>
    </footer>
    <script src="./swiper.min.js"></script>
    <script>
        var swiper = new Swiper('.swiper-container', {
            pagination: '.swiper-pagination',
            nextButton: '.swiper-button-next',
            prevButton: '.swiper-button-prev',
            slidesPerView: 1,
            paginationClickable: true,
            spaceBetween: 30,
            loop: true,
            autoplay:1000
        })
    </script>
</body>
</html>